<script setup>
import {onUpdated, ref} from "vue";
import {getAllCollection} from "@/api/user.js";
import {getUserLocal} from "@/utils/auth.js";
import {getProductDetail, getProductImage} from "@/api/shoe.js";
import Refresh from "@/components/refresh.vue";

const list = ref([]);
const loading = ref(false);
const finished = ref(false);
const itemList = ref([])
const picList = ref([])
const proList = ref([])
const onLoad = () => {
  // 异步更新数据
  // setTimeout 仅做示例，真实场景中一般为 ajax 请求


  // 加载状态结束
  loading.value = false;

  // 数据全部加载完成

  finished.value = true;

};
const test = ref()

function fresh() {
  itemList.value = []
  picList.value = []
  proList.value = []
  getAllCollection({uid: getUserLocal().uid}).then(res => {
    test.value = res.data.data

    for (let i = 0; i < res.data.data.length; i++) {
      getProductDetail({pid: res.data.data[i].productId}).then(result => {
        console.log(result)
        itemList.value.push(result.data.data)
      })
      proList.value.push(res.data.data[i].productId)
      getProductImage({pid: res.data.data[i].productId}).then(result => {
        console.log('aaaa')
        console.log(result)
        picList.value.push(result.data.data[0])
      })
    }
    console.log(itemList.value)
    console.log(picList.value)
  })
}

onUpdated(() => {
  fresh()
})
fresh()
</script>

<template>
  <div>
    <van-nav-bar
        title="收藏列表"
        left-text="返回"
        left-arrow
        @click-left="$router.back()">
    </van-nav-bar>
    <refresh @onRefreshItem="() => {fresh()}">
      <van-list
          v-model:loading="loading"
          :finished="finished"
          finished-text="没有更多了"
          @load="onLoad"
      >
        <van-card v-for="(item,i) in itemList" :key="item.id"
                  tag="新"
                  :price="item.price"
                  desc="描述信息"
                  :title="item.title"
                  :thumb='picList[i].image'
                  @click="$router.push({name:'shoeDetail',params:{id:proList[i]}})"
        />
      </van-list>
    </refresh>
  </div>
</template>

<style scoped>

</style>